Site layout refactor #61
Conversation
* new site layout with an animated drawer * put base rem back to 16px * shifting hbs templates around to match new structure better
|
UI bundle preview build failure! ❌
|
|
Antora site build failure! ❌
|
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
UI bundle preview build failure! ❌
|
|
Antora site build failure! ❌
|
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
Realize this may be a work in progress, but some early feedback:
|
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
| @@ -27,12 +27,6 @@ const cleanTask = createTask({ | |||
| call: task.remove(['build', 'public']), | |||
| }) | |||
|
|
|||
| const lintCssTask = createTask({ | |||
There was a problem hiding this comment.
I decided to remove stylelint for the project. It's no longer maintained and was causing some headaches with prettier. And now that we have prettier I feel that is a good replacement, though it would be ideal to add a step in the gulp process to run prettier on our css files to keep things consistent much like stylelint was doing. Let's handle that later
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
@mlr Those two issues should be fixed now! |
|
@colegoldsmith I'm not sure if this is something @kurtenj specced out in Figma, but the information hierarchy of the new nesting behavior looks wrong to me. In the example below, it looks like "Connect your database" is a child of "Load data" even though it's actually a sibling. I'd expect the text of items at the same level to share the same left alignment. 
That said, this is still a big improvement over the completely flat nav from before, so I don't want perfect to be the enemy of good if this is a big lift to get this working as I described. |
|
@colegoldsmith It looks like we've lost the ability to scroll the right nav. See https://fantastic-adventure-593lpwy.pages.github.io/site-layout-refactor/astra-db-vector/clients/python.html#paginate-the-results-from-a-search |
|
@colegoldsmith It looks like page content is centered only on pages without a TOC. Again, I'd like @kurtenj to chime in here, but the transition between pages with a TOC and pages without a TOC is a bit jarring because the horizontal position of the content changes depending on which kind of page you're viewing. With a TOC: Without a TOC: |
|
@colegoldsmith @kurtenj The spacing between 1) the breadcrumb and title, and 2) the title and time commitment indicator, feels a bit cramped compared to the old layout. Old layout: 
New layout: 
|
|
+1 to all of @djsauble's points. @colegoldsmith I'll let you be the judge of what should be addressed pre- or post-merge.
^ regarding the above feedback item, I also noticed that the page TOC (right nav) no longer highlight's the current section as I scroll. Might be a symptom of the same underlying issue, but wanted to call it out specifically just in case. |
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
Thanks @djsauble I've fixed the following issues you mentioned:
|
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
Great improvement, thanks! |
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
|
UI bundle preview build successful! ✅ |
|
Antora site build successful! ✅ |
Lots of updates here, mainly removing a lot of the default UI styles and re-writing the UI template files with tailwind classes. I'll try to list the notable changes: